import Taro from '@tarojs/taro-rn';
import * as tslib_1 from "tslib";
import React from 'react';
import { Component } from "@tarojs/taro-rn";
import { View, ScrollView, Text } from "@tarojs/components-rn";
import { toJS } from 'mobx';
import { inject, observer } from "@tarojs/mobx-rn";
import { getRuntime, typeOfJobArr, pageSize, typeOfJob } from "../../utils/common";
import personnel_centerStyleSheet from "./personnel_center_styles";
var _styleSheet = personnel_centerStyleSheet;

function _getClassName() {
  var className = [];
  var args = arguments[0];
  var type = Object.prototype.toString.call(args).slice(8, -1).toLowerCase();

  if (type === 'string') {
    args = args.trim();
    args && className.push(args);
  } else if (type === 'array') {
    args.forEach(function (cls) {
      cls = _getClassName(cls).trim();
      cls && className.push(cls);
    });
  } else if (type === 'object') {
    for (var k in args) {
      k = k.trim();

      if (k && args.hasOwnProperty(k) && args[k]) {
        className.push(k);
      }
    }
  }

  return className.join(' ').trim();
}

function _getStyle(classNameExpression) {
  var className = _getClassName(classNameExpression);

  var classNameArr = className.split(/\s+/);
  var style = [];

  if (classNameArr.length === 1) {
    style.push(_styleSheet[classNameArr[0].trim()]);
  } else {
    classNameArr.forEach(function (cls) {
      style.push(_styleSheet[cls.trim()]);
    });
  }

  return style;
}

let Personnel = class Personnel extends Component {
  constructor(props) {
    super(props);
    this.state = {
      allProvince: [],
      provinceId: null,
      allTechnicalTitle: [],
      technicalTitleId: null,
      allMajorCategory: [],
      majorCategoryId: null,
      typeOfJobArr,
      typeOfJobId: null,
      currentNavId: 0,
      pageIndex: 1,
      pageSize,
      totalCount: 0,
      items: []
    };
  }
  componentWillMount() {
    Taro.setNavigationBarTitle({ title: '工程人才中心' });
    this.getAllProvince();
    this.getAllTechnicalTitle();
    this.getAllMajorCategory();
    this.getDate();
  }
  // 获取页面数据-人才库信息
  getAllResumeInfo() {
    let { TalentStore } = this.props.stores;
    let { provinceId, typeOfJobId, pageIndex, pageSize, technicalTitleId, majorCategoryId } = this.state;
    TalentStore.getAllResumeInfo({
      formMajorCategoryId: majorCategoryId,
      formTechnicalTitleId: technicalTitleId,
      formProvinceId: provinceId,
      formTypeOfJob: typeOfJobId,
      pageIndex,
      pageSize,
      callback: res => {
        if (pageIndex === 1) {
          this.setState({
            totalCount: toJS(res.totalCount),
            items: toJS(res.items)
          });
        } else {
          const { items } = this.state;
          items.push(...(res.items || []));
          this.setState({
            totalCount: res.totalCount,
            items
          });
        }
      }
    });
  }
  // 获取页面数据-简历库信息
  getAllRecruitInfo() {
    let { TalentStore } = this.props.stores;
    let { provinceId, typeOfJobId, pageIndex, pageSize } = this.state;
    TalentStore.getAllRecruitInfo({
      formProvinceId: provinceId,
      formTypeOfJob: typeOfJobId,
      pageIndex,
      pageSize,
      callback: res => {
        console.log(res);
        if (pageIndex === 1) {
          this.setState({
            totalCount: toJS(res.totalCount),
            items: toJS(res.items)
          }, () => {
            // 职位详情页使用
            getRuntime().setStorage('positionInfo', this.state.items);
          });
        } else {
          const { items } = this.state;
          items.push(...(res.items || []));
          this.setState({
            totalCount: res.totalCount,
            items
          }, () => {
            // 职位详情页使用
            getRuntime().setStorage('positionInfo', this.state.items);
          });
        }
      }
    });
  }
  onReachBottom() {
    let { totalCount, pageSize, pageIndex } = this.state;
    const { loading } = this.props.stores.TalentStore;
    if (totalCount > pageIndex * pageSize && !loading) {
      this.setState({
        pageIndex: pageIndex + 1
      }, () => {
        this.getAllResumeInfo();
      });
    }
  }
  getAllProvince() {
    let { AreaStore } = this.props.stores;
    AreaStore.getAllProvinceFromLocal({
      callBack: res => {
        this.setState({
          allProvince: res
        }, () => {});
      }
    });
  }
  // 获取职称
  getAllTechnicalTitle() {
    let { TalentStore } = this.props.stores;
    TalentStore.getAllTechnicalTitle({
      callback: res => {
        // console.log(res)
        this.setState({
          allTechnicalTitle: toJS(res.items)
        });
      }
    });
  }
  // 获取专业类别
  getAllMajorCategory() {
    let { TalentStore } = this.props.stores;
    TalentStore.getAllMajorCategory({
      callback: res => {
        // console.log(res)
        this.setState({
          allMajorCategory: toJS(res.items)
        });
      }
    });
  }
  handelRouter(url = '/pages/index/index') {
    getRuntime().navigateTo(url);
  }
  handelUpgrade(url = '/pages/index/index') {
    if (!getRuntime().getToken()) {
      getRuntime().navigateTo('/pages/login/login');
      return;
    }
    getRuntime().navigateTo(url);
  }
  changeNav(currentNavId) {
    this.setState({
      currentNavId,
      items: [],
      pageIndex: 1
    }, () => {
      this.getDate();
    });
  }
  getDate() {
    if (this.state.currentNavId === 0) {
      this.getAllResumeInfo();
    } else {
      this.getAllRecruitInfo();
    }
  }
  changeTechnicalTitleId(id) {
    this.setState({ technicalTitleId: id }, () => this.getDate());
  }
  changeProvinceId(id) {
    this.setState({ provinceId: id }, () => this.getDate());
  }
  changeMajorCategoryId(id) {
    this.setState({ majorCategoryId: id }, () => this.getDate());
  }
  changeTypeOfJobId(id) {
    this.setState({ typeOfJobId: id }, () => this.getDate());
  }
  render() {
    let { currentNavId, allTechnicalTitle, technicalTitleId, allProvince, provinceId, allMajorCategory, majorCategoryId, typeOfJobArr, typeOfJobId, items } = this.state;
    console.log(items);
    return <View style={_styleSheet["personnel-index"]}>
        <ScrollView scrollX={true} style={_styleSheet["scroll-view-nav"]}>
          <View onClick={this.changeNav.bind(this, 0)} style={_getStyle(currentNavId === 0 ? 'scroll-item scroll-item-on' : 'scroll-item')}>人才库<Text style={_styleSheet["line"]} /></View>
          <View onClick={this.changeNav.bind(this, 1)} style={_getStyle(currentNavId === 1 ? 'scroll-item scroll-item-on' : 'scroll-item')}>招聘信息<Text style={_styleSheet["line"]} /></View>
        </ScrollView>

        <View style={_styleSheet["interval"]} />

        <View style={_styleSheet["select-option"]}>
          
          {allTechnicalTitle.length > 0 && <View style={_styleSheet["option-item"]}>
            <View onClick={this.changeTechnicalTitleId.bind(this, null)} style={_getStyle(!technicalTitleId ? 'option all option-active' : 'option all')}>全部</View>
            <ScrollView scrollX scrollWithAnimation style={_styleSheet["scrollview"]}>
              {allTechnicalTitle.map(item => {
              return <View key={item.id} onClick={this.changeTechnicalTitleId.bind(this, item.id)} style={_getStyle(technicalTitleId === item.id ? 'option option-active' : 'option')}>{item.titleName}</View>;
            })}
            </ScrollView>
          </View>}
          
          <View style={_styleSheet["option-item"]}>
            <View onClick={this.changeProvinceId.bind(this, null)} style={_getStyle(!provinceId ? 'option all option-active' : 'option all')}>全部</View>
            <ScrollView scrollX scrollWithAnimation style={_styleSheet["scrollview"]}>
              {allProvince.map(item => {
              return <View key={item.value} onClick={this.changeProvinceId.bind(this, item.value)} style={_getStyle(provinceId === item.value ? 'option option-active' : 'option')}>{item.label}</View>;
            })}
            </ScrollView>
          </View>
          
          {allMajorCategory.length > 0 && <View style={_styleSheet["option-item"]}>
            <View onClick={this.changeMajorCategoryId.bind(this, null)} style={_getStyle(!majorCategoryId ? 'option all option-active' : 'option all')}>全部</View>
            <ScrollView scrollX scrollWithAnimation style={_styleSheet["scrollview"]}>
              {allMajorCategory.map(item => {
              return <View key={item.id} onClick={this.changeMajorCategoryId.bind(this, item.id)} style={_getStyle(majorCategoryId === item.id ? 'option option-active' : 'option')}>{item.majorCateName}</View>;
            })}
            </ScrollView>
          </View>}
          
          {typeOfJobArr.length > 0 && <View style={_styleSheet["option-item"]}>
               <View onClick={this.changeTypeOfJobId.bind(this, null)} style={_getStyle(!typeOfJobId ? 'option all option-active' : 'option all')}>全部</View>
               <ScrollView scrollX scrollWithAnimation style={_styleSheet["scrollview"]}>
                 {typeOfJobArr.map((item, index) => {
              return <View key={index} onClick={this.changeTypeOfJobId.bind(this, index + 1)} style={_getStyle(typeOfJobId === index + 1 ? 'option option-active' : 'option')}>{item}</View>;
            })}
               </ScrollView>
            </View>}
        </View>

        <View style={_styleSheet["interval"]} />

        <View style={_styleSheet["list-06"]}>
          {items.length > 0 && items.map(item => {
          let tpl = null;
          switch (item.publicationType) {
            case 3:
              {
                // 职位
                tpl = <View style={_styleSheet["list-06-item"]}>
                    <View style={_styleSheet["item-title"]}>
                      <View style={_styleSheet["title"]}>
                        {item.positionName}
                        <Text style={_styleSheet["label"]}>{item.jobNature}</Text>
                      </View>
                      <View style={_styleSheet["address"]}>{item.address}</View>
                    </View>
                    <View style={_styleSheet["item-info"]}>
                      <View style={_styleSheet["info"]}>
                        <Text style={[_styleSheet["op"], _styleSheet["i"]]}>{item.monthlyPay}</Text>
                        <Text style={_styleSheet["i"]}>{item.education}</Text>
                        <Text style={_styleSheet["i"]}>{item.recruitment}人</Text>
                        <Text style={[_styleSheet["i"], _styleSheet["brnone"]]}>{item.technicalTitle}</Text>
                      </View>
                      <View onClick={this.handelRouter.bind(this, '/pages/newest/position_detail?id=' + item.id)} style={_styleSheet["btn-view"]}>
                        查看
                      </View>
                    </View>
                  </View>;
                break;
              }
            case 4:
              {
                // 人才
                tpl = <View style={_styleSheet["list-06-item"]}>
                      <View style={_styleSheet["item-title"]}>
                        <View style={_styleSheet["title"]}>
                          {item.positionName}
                          <Text style={_styleSheet["label"]}>{typeOfJob(item.typeOfJob)}</Text>
                        </View>
                      </View>
                      <View style={_styleSheet["item-info"]}>
                        <View style={_styleSheet["info"]}>
                          <Text style={_styleSheet["i"]}>{item.education}</Text>
                          <Text style={_styleSheet["i"]}>{item.technicalTitle}</Text>
                          <Text style={[_styleSheet["i"], _styleSheet["brnone"]]}>{item.workYears}</Text>
                        </View>
                        <View onClick={this.handelRouter.bind(this, '/pages/newest/personnel_detail?id=' + item.id)} style={_styleSheet["btn-view"]}>
                          查看
                        </View>
                      </View>
                    </View>;
                break;
              }
          }
          return tpl;
        })}
          {items.length <= 0 && <View style={_styleSheet["page-none-info"]}>没有相关信息...</View>}
        </View>

        <View style={_styleSheet["footer-block"]} />

        <View style={_styleSheet["footer-personnel"]}>
          <View onClick={this.handelUpgrade.bind(this, '/pages/index/position')} style={[_styleSheet["btn"], _styleSheet["btn1"]]}>发布职位</View>
          <View onClick={this.handelUpgrade.bind(this, '/pages/index/rresume')} style={[_styleSheet["btn"], _styleSheet["btn2"]]}>填写简历</View>
        </View>
      </View>;
  }
};
Personnel = tslib_1.__decorate([inject("stores"), observer], Personnel);
export default Personnel;